<template>
  <a-popconfirm
    title="你确定要作废吗？"
    cancel-text="取消"
    placement="bottomRight"
    v-model:open="open"
    :disabled="props.data.isBind"
  >
    <template #okButton>
      <a-button type="primary" size="small" @click="confirm" :loading="loading">
        确定
      </a-button>
    </template>
    <a-button
      type="link"
      style="padding: 4px 6px"
      @click="onOpen"
      :disabled="props.data.isBind"
    >
      作废
    </a-button>
  </a-popconfirm>
</template>
<script setup>
import { ref } from 'vue'
import { deleteRole } from '@/api/role.js'
import { useDataSourceManager } from './provide-context.js'
import { message } from 'ant-design-vue'
import { rowProps } from 'ant-design-vue/es/grid/Row.js'

/**
 * 全局数据
 */
let { update } = useDataSourceManager()
/**
 * 外部参数
 */
let props = defineProps({
  data: { type: Object, required: true },
})
/**
 * 操作
 */
let loading = ref(false)
let open = ref(false)
async function confirm() {
  loading.value = true
  try {
    await deleteRole(props.data.roleId)
    await update()
    loading.value = false
    open.value = false
    message.success('废除成功')
  } catch (e) {
    loading.value = false
    open.value = false
  }
}
/**
 * 打开气泡
 */
function onOpen() {
  open.value = true
}
</script>
<style lang="less" scoped></style>
